<!--  -->
<template>
  <div id="box">
      <!-- 父组件给子组件传值 要是没有变量 不需要加v-bind  直接子组件用props里相应的变量接受 -->
        <Tabbaritem path="/Home">
            <div slot="img" ><img src="~assets/img/shop.png"/></div>
            <div slot="redimg"><img src="~assets/img/redshop.png"/></div>
            <span slot="text">首页</span>
        </Tabbaritem>

         <Tabbaritem path="/fenlei">
            <div slot="img"><img src="~assets/img/shop.png"/></div>
             <div slot="redimg"><img src="~assets/img/redshop.png"/></div>
            <span slot="text">分类</span>
        </Tabbaritem>

        <Tabbaritem path="/shopping">
            <div slot="img"><img src="~assets/img/shop.png"/></div>
             <div slot="redimg"><img src="~assets/img/redshop.png"/></div>
            <span slot="text">购物车</span>
        </Tabbaritem>
        <Tabbaritem path="/user">
            <div slot="img"><img src="~assets/img/shop.png"/></div>
             <div slot="redimg"><img src="~assets/img/redshop.png"/></div>
            <span slot="text">我的</span>
        </Tabbaritem>
  </div>
</template>

<script>

 import Tabbaritem from "../commot/Tabbaritem"
export default {
    name:"tabbar",
    components: {
        Tabbaritem
    }
}

</script>
<style scoped>
     #box{
          display: flex;
          height: 49px;
          background: #f6f6f6;
          position: fixed;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 9;
     }
  
</style>